<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style type="text/css">
        /*
            当时用不同的选择器，选中同一个元素时并且设置相同的样式时，这时样式之间产生了冲突，最终到底采用哪个选择器定义的样式，
            由选择器的优先级（权重）决定， 优先级高的优先显示。

            优先级的规则：
                内联样式：1000
                id选择器：100
                类和伪类选择器：10
                元素选择器：1
                通配选择器：0
                继承的样式没有优先级

                当选择器中包含多种选择器时，需要将多种选择器的优先级相加然后在比较，但是注意：选择器优先级计算不会超过他的最大数量级，如果选择器的优先级一样，则使用靠后的样式

                并集选择器的优先级是单独计算的 , 并不会相加
                div, p , #q, .a{}

                !important:
                    可以在样式的最后，添加一个!important, 则此时该样式将会获得一个最高的优先级，将会优先于所有的样式优先显示，甚至超过了内联样式。
                .p1{
                    color:yellow !important;
                }
                但是在开发中尽量避免使用!important:


        */
    </style>
</head>
<body>
    <p>我是一个段落</p>
</body>
</html>